// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.1

// Для начала объявляю прямоугольник, который
// и будет основой полосы прокрутки.
Rectangle {
	id: scrollbar
	
	// Объявлю свойство через которое внешний код
	// будет получать значение позиции. 
	// Значение позиции изменяется то 0 до 1.
	// 0 — бегунок в самом верху. 1 — бегунок в самом
	// низу.
	property real position: handle.y / (height - handle.height)
	
	// Фиксирую ширину. Высоту надо обязательно
	// задавать во внешнем коде — вертикальная 
	// полоса растянута по высоте.
	width: 15
	
	// Далее несколько украшательств.
	radius: 3 // Скругление углов.
	color: "#333333" // Цвет фона.
	border.color: "#000000" // Цвет границы.
	
	// Теперь опишу бегунок
	// Он представляет собой вложенный прямоугольник
	// меньшего размера.
	Rectangle {
		id: handle
		
		// Ширина бегунка ровна ширине всей полосы.
		width: scrollbar.width
		
		// Фиксирую высоту бегунка.
		height: 50
		
		// Далее несколько украшательств.
		color: "#8d8c8c"
		radius: 3
		border.color: "#d9d8d8"
		
		// Теперь объявляю область обработки действий
		// мыши, чтобы с обеспечить перетаскивание
		// бегунка.
		MouseArea{
			// Область занимает весь бегунок
			anchors.fill: parent
			
			// Для обеспечения перетаскивания объектов
			// мышью предназначено поле drag.
			drag.target: handle // Укажу идентификатор объекта
			                    // который можно будет перетаскивать.
			drag.axis: Drag.YAxis // Перемещать handle можно только
			                      // по вертикали.
			// Далее ограничения в которых можно
			// перемещать handle. Максимальная позиция
			// вычисляется как разность между высотой
			// полосы прокрутки и высотой бегунка, чтобы
			// бегунок не вылезал за край полсы.
			drag.minimumY: 0
			drag.maximumY: scrollbar.height - handle.height
		}
	}
}
